<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>

    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#image').click(function () {
                $(this).attr('src',"/app/getvcode"+Math.random())
            })
        })
    </script>
    <style type="text/css">
        .form{margin: 100px auto;text-align: center;width: 50%;background: aqua;padding: 30px 0}
        .form input{height: 20px;margin: 10px 0}
        .form h2 a{text-decoration: none}
        ul{margin: 20px auto;text-align: center;width: 80%;}
        ul li{list-style: none;float: left;font-size: 20px;
                width: 8%;background: gray;margin-bottom: 20px;height: 40px}
        .heade ul li a{text-decoration: none;margin-bottom: 20px;font-size: 20px;line-height: 40px;color: aliceblue}
        .heade ul li:hover{background: darkgray}
         .title{text-align: center ;color:royalblue}
        .register{background: red}
    </style>
</head>
<body>
    <div class="title"><h1>注册</h1></div>

    <div class="heade">
        <ul>
            <li><a href="/">首页</a></li>
            {% for s in con_style %}
                <li><a href="{% url 'app:content' s.s_ename 1 %}">{{ s.s_name }}</a></li>
            {% endfor %}
                <li class="register"><a href="/app/register">注册</a></li>
            {% if utoken %}
                <li><a href="/app/mine/">{{ uname }}</a></li>
            {% else %}
                <li><a href="/app/login/">{{ uname }}</a></li>
            {% endif %}
        </ul>
        </div>
    <div class="form">
        <form method="post" enctype="multipart/form-data">
            {% csrf_token %}

            头像
            <input type="file" name="uicon"><br>
            用户名：
            <input type="text" placeholder="输入用户名" name="uname"><br>
            密码：
            <input type="password" placeholder="输入密码" name="upwd"><br>
            <img id="image" src="/app/getvcode"><br>
            验证码：
            <input type="text" placeholder="输入验证码" name="ucode"><br>
            <input type="submit" value="注册">
        </form>
    </div>

</body>
</html>